vue 加 element ui 事件触发

您所在的位置:网站首页 vue框架搭建 emlementui vue 加 element ui 事件触发

vue 加 element ui 事件触发

2023-03-09 02:03| 来源: 网络整理| 查看: 265

本网页使用Webfrom 开发 开发工具 vistual Studio 2022 本地安装 Vue.js 前端框架element uijs 使用 ajax 请求在渲染前端时 加载element 表格 时 在表格中加入:v-loading='loading' 属性加载时 使用双向绑定 在settimeout中改变loading 变量值 前端断点调试时打印loading值已经改变 可是页面并没有效果 而且其他表格的事件都触发不了 现在不清楚是兼容问题还是版本问题,但是在layout 母版页 @click 事件可以触发 但是到了子页面 ResourceData 可以请求接口却触发不了事件 且页面的表格的数据加载好了 却触发不了表格的各种事件(包括多选单击事件等等都触发不了)

主页 系统主页 系统记录 资源中心 配置管理 权限配置 角色配置 属性配置 个人主页 系统设置 退出登录 查看更多 —————————————— Do you Want Codeing Together? Going ichigo Demo —————————————— //Vue.prototype.ΩappName = 'ichigo app' var app = new Vue({ el: '#Home', data: { Show: true, CircleUrl: "", CurrentDate: "", }, beforeCreate() { //console.log(this.ΩappName) }, mounted() { let that = this; that.PageLoading(); }, methods: { PageLoading() { this.Show = false; this.GetUserCode(); this.GetUserInfo(); }, GetUserCode() { //为了避免中文乱码,应该对值进行URL编码(使用时需要URL解码) $.ajax({ type: "POST", url: "/Ashx/Home/Home.ashx?action=GetUserCode", async: false, data: {}, success: function (data) { if (data != null) { localStorage.setItem("U_Code", data.Data); } else { location.href = "http://localhost:62457/Page/ErrorPage/501.html" } }, error: function (e) { location.href = "http://localhost:62457/Page/ErrorPage/404.html" } }); }, GetUserInfo() { let that = this; $.ajax({ type: "GET", url: "/Ashx/Home/Home.ashx?action=GetUserInfo", async: false, dataType: "json", success: function (data) { if (data == null) { location.href = "http://localhost:62457/Page/LoginPage/Login.aspx" } else { that.CircleUrl = data.Data.UI_Img; } }, error: function (e) { that.$message.warning('个人信息不完整,请前往个人中心补充'); } }); }, GoUserInfoPage() { location.href = "http://localhost:62457/Page/UsersInfoPage/UserInfo.aspx" }, GoResourceDataPage() { location.href = "http://localhost:62457/Page/ResourceDataPage/ResourceData.aspx" }, SelectMoudle(key, keyPath) { console.log(key, keyPath); } } }) .el-menu.el-menu--horizontal { border-bottom: none; } .IndexImg { background-size: cover; background-position: center; align-content: center; } .el-avatar > img { width:100%; /*object-fit: fill;*/ } .MyIndex { display: flex; width: 100vw; height: 100vh; margin: auto; font-weight: 100; font-family: "Microsoft YaHei",微软雅黑; } .HeadAnima { margin: auto; height: 20%; width: 100%; } .BodyAnima { margin: auto; height: 20%; width: 100%; } .FooterAnima { margin: auto; height: 20%; width: 100%; } .el-menu-demo { width: 40%; display: inline-block; } .JobTab { width: 80%; display: flex; } .SearchContent { display: inline-block; height: auto; width: 60%; } .MyInputSearch { padding: 10px; width: 100%; } .block { padding: 4px; display: flex; } .Headimg { width: 20%; display: flex; } .HeadContent { display: flex; width: 40%; align-items: center; } .ContentLeft { width: 60%; display: flex; align-items: center } .MyHead { height: 20%; width: 100%; display: flex; margin: auto; border: 1px solid #EEEEEE; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); } .MyFooter { height: 20%; width: 100%; margin: auto; display: flex; border: 1px solid #EEEEEE; background-color: white; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04); } .MyBody { height: 60%; width: 100%; margin: 0px 0px 0px 0px; display: flex; border: 1px solid #EEEEEE; background-color: #f7f7f7; } .FootText { text-align: center; font-size: 12px; color: #c1c1c1; display: flex; align-items: center; margin: auto; font-weight: 100; font-family: "Microsoft YaHei",微软雅黑; } .ResDataBox { display: flex; justify-content: center; align-content: center; width: 100%; height: 100%; border: 1px solid #eaeaea; } .ResTable { overflow: revert; } .Respagination { display:flex; } .RD_Name_Class { font-size:13px; font-optical-sizing:auto; font-palette:dark; font-weight:400; } {{scope.row.RD_Name}} {{scope.row.RD_Url.length>10?scope.row.RD_Url.slice(0,35)+'...':'0'}} {{scope.row.RD_State== 0 ? '可用':scope.row.RD_State== -1?'损坏':'过期'}} {{scope.RD_CreateTime=scope.row.RD_CreateTime.slice(0,10)+' '+scope.row.RD_CreateTime.slice(11,19)}} {{scope.RD_UpdateTime=scope.row.RD_UpdateTime.slice(0,10)+' '+scope.row.RD_UpdateTime.slice(11,19)}} var app=new Vue({ el: "#Resource", data:{ show: true, loading: true, tableData: [{}], multipleSelection: [] }, mounted() { setTimeout(() => { this.loading = false; console.log(this.loading) },2000) this.GetResourceDataList(); }, methods: { GetResourceDataList() { let that = this; //axios.get('/Ashx/ResourceData/ResourceData.ashx', { action:"GetResourceDataList"}).then((d) => { // console.log("ABCD",d); //}).catch((err) => { // console.log(err) //}) $.ajax({ type: "GET", url: "/Ashx/ResourceData/ResourceData.ashx?action=GetResourceDataList", async: false, dataType: "json", success: function (data) { console.log(data); that.tableData = data.Data; }, error: function (e) { that.MsgError("错误消息", "请求资源错误!!") } }); }, MsgError(title, val) { this.$notify.error({ title: title, message: val }); }, handleClick(scope, row) { console.log(scope) }, handleSelectionChange(val) { this.multipleSelection = val; console.log(val) }, RowClick() { console.log(1111) } } })


【本文地址】


今日新闻


推荐新闻


    CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3